<section class="content-header">
  <h1>System Config</h1>
</section>
<section class="content">
  <form novalidate #form="ngForm" (ngSubmit)="save(form)">
    <div class="form-group" [class.has-error]="form.submitted && config.EnablePrivateRegistry && privateRegistryInput.invalid">
      <div class="checkbox">
        <label>
          <input type="checkbox" name="enablePrivateRegistry" [ngModel]="config.EnablePrivateRegistry" (ngModelChange)="enablePrivateRegistryChange($event)">
          <b>Enabel Private Registry</b>
        </label>
      </div>
      <input type="text" class="form-control" name="privateRegistry" #privateRegistryInput="ngModel" [(ngModel)]="config.PrivateRegistry"
        [attr.disabled]="config.EnablePrivateRegistry ? null : 'disabled'" autocomplete="off" required pattern="https?://.+">
      <div *ngIf="form.submitted && config.EnablePrivateRegistry && privateRegistryInput.invalid">
        <span class="help-block" *ngIf="privateRegistryInput.errors.required">Private registry address is required.</span>
        <span class="help-block" *ngIf="privateRegistryInput.errors.pattern">Invalid URL.</span>
      </div>
    </div>
    <div class="form-group" [class.has-error]="form.submitted && config.EnableClusterMode && humpbackCenterAPIInput.invalid">
      <div class="checkbox">
        <label>
          <input type="checkbox" name="enableClusterMode" [(ngModel)]="config.EnableClusterMode">
          <b>Enable Cluster Mode</b>
        </label>
      </div>
      <input type="text" class="form-control" name="humpbackCenterAPI" #humpbackCenterAPIInput="ngModel" [(ngModel)]="config.HumpbackCenterAPI"
        [attr.disabled]="config.EnableClusterMode ? null : 'disabled'" autocomplete="off" required pattern="https?://.+">
      <div *ngIf="form.submitted && config.EnableClusterMode && humpbackCenterAPIInput.invalid">
        <span class="help-block" *ngIf="humpbackCenterAPIInput.errors.required">HumpbackCenterAPI address is required.</span>
        <span class="help-block" *ngIf="humpbackCenterAPIInput.errors.pattern">Invalid URL.</span>
      </div>
    </div>
    <div class="form-group">
      <label>Top news</label>
      <input type="text" class="form-control" name="topNews" [(ngModel)]="config.TopNews" autocomplete="off" maxlength="500">
    </div>
    <div class="form-group">
      <button type="submit" class="btn btn-flat bg-olive">
        <i class="fa fa-save"></i> Save
      </button>
    </div>
  </form>
</section>
